<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">

    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>登录页</title>
    <link rel="shortcut icon" type="image/x-icon"/>
    <link rel="stylesheet" th:href="@{/css/font.css}">
    <link rel="stylesheet" th:href="@{/css/xadmin.css}">
    <script type="text/javascript" th:src="@{/lib/jquery/jquery.min.js}"></script>
    <script charset="utf-8" th:src="@{/lib/layui/layui.js}"></script>
    <script type="text/javascript"  th:src="@{/js/xadmin.js}"></script>

    <link rel="stylesheet" th:href="@{/css/style.css}">

</head>
<body>

<div class="login-main">
    <header class="layui-elip">登录</header>
    <form class="layui-form">
        <div class="layui-input-inline">
            <input type="text" name="username" lay-verify="required" lay-vertype="tips" placeholder="用户名" autocomplete="off"
                   class="layui-input">
        </div>
        <div class="layui-input-inline">
            <input type="password" name="password" lay-verify="required" lay-vertype="tips" placeholder="密码" autocomplete="off"
                   class="layui-input">
        </div>
        <div class="layui-input-inline" th:if="${loginVerify}">
            <input name="captcha" lay-verify="required" placeholder="验证码" style="width:50%;" type="text"
                   class="layui-input-inline layui-input">
            <img style="margin-bottom: 15px;" onclick="generateCaptcha(this)"
                 th:src="@{/captcha(timestamp=${new java.util.Date().getTime()})}"/>
        </div>
        <div class="layui-input-inline login-btn">
            <button lay-submit lay-filter="login" class="layui-btn layui-btn-blue">登录</button>
        </div>
        <hr/>
        <!--<div class="layui-input-inline">-->
            <!--<button type="button" class="layui-btn layui-btn-primary">QQ登录</button>-->
        <!--</div>-->
        <!--<div class="layui-input-inline">-->
            <!--<button type="button" class="layui-btn layui-btn-normal">微信登录</button>-->
        <!--</div>-->
        <p><a th:href="@{/register}" class="fl">立即注册</a><a href="javascript:" class="fr">忘记密码？</a></p>
    </form>
</div>

<script type="text/javascript">

    // 如果在 iframe 中, 则跳出 iframe
    if (self !== top) {
        top.location.href = location.href;
    }
    $(function () {
        layui.use(['form', 'layer', 'jquery'], function () {

            // 操作对象
            var form = layui.form;
            var $ = layui.jquery;
            form.on('submit(login)', function (data) {
                $.post('login', data.field, function (result) {
                    handlerResult(result, loginDone);
                });
                return false;
            });
        });
    });


    function generateCaptcha(obj) {
        $(obj).attr("src", "/captcha?timestamp=" + (new Date()).valueOf());
    }

    function loginDone(data) {
        layer.msg("登陆成功, 即将跳转到首页!", {
            icon: 1,
            time: 1000
        }, function () {
            location.href = 'main';
        });
    }

</script>
</body>
</html>